<#import "/layout.html" as c>
    <#import "/list_layout.html" as list>
        <#assign alertList = []/>
        <#assign alertList = alertList + ["这里是点击回复素材管理界面。"]/>
        <@c.html title="Index">
        <@list.html title="点击回复素材" subTitle="点击回复素材管理" alertList=alertList permi="sys:admin:save" addBtn=true searchHint="请输入点击回复素材名称进行模糊搜索">
    </@list.html>
        <style>
            .clickreply-image{
                width: 180px;
                height: 100px;
                border: solid 1px #E6E6E6;
                background-color: #F5F5F5;
                text-align: center;
                box-shadow: 0 0 4px rgba(0,0,0,0.05);
                overflow: hidden;
                border-radius: 3px;
            }
        </style>
    <!-- 开始新增点击回复素材模态窗口 -->
    <div class="modal fade" id="addModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title"> 新增点击回复素材 <a class="btn btn-info btn-xs m-l-10" role="button" data-toggle="collapse" href="#OperationTipsAdd" aria-expanded="false" title="操作提示"> <i class="fa fa-exclamation"></i> &nbsp;提示 </a> </h4>
                </div>
                <div class="modal-body">
                    <!-- 开始操作提示 -->
                    <ul class="text-info p-b-15 p-l-15 collapse" role="tabpanel" id="OperationTipsAdd">
                        <li class="m-b-3">用于微信公众号自定义菜单按钮点击后的回复。</li>
                        <li class="m-b-3">图文图片按照规定尺寸宽360像素、高200像素，格式为jpg\gif\png的图片上传。</li>
                        <li class="m-b-3">图文链接地址请填写完整的带http://的URL地址。</li>
                    </ul>
                    <!-- 结束操作提示 -->
                    <!-- 开始新增品牌设置模块-->
                    <form class="form-horizontal form-bordered p-0" id="addForm" autocomplete="off" action="${adminRoot}clickreply/json/add" method="post" data-parsley-validate="true">
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复主题 <i class="f-s-14 text-danger">*</i> &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="crTitle" type="text" name="title" class="form-control" placeholder="请输入点击回复素材的主题" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击回复素材的主题" data-parsley-required="true" data-parsley-maxlength="30" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复说明 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="crNote" type="text" name="note" class="form-control" placeholder="请输入点击回复素材的说明" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击回复素材的说明"  data-parsley-maxlength="100" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 点击标识码 <i class="f-s-14 text-danger">*</i> &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="crCode" type="text" name="code" class="form-control" placeholder="请输入点击标识码" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击标识码" data-parsley-required="true"  data-parsley-maxlength="30" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复类型 &nbsp;:</label>
                            <div class="col-md-9 col-sm-8"> <span data-tip="tooltip" data-placement="right" data-original-title="请选择点击回复事件的类型">
                          <label class="radio-inline">
                            <input id="crType_2" name="type" type="radio" value="2" checked="">
                            图文</label>
                          <label class="radio-inline">
                            <input id="crType_1" name="type" type="radio" value="1">
                            文字</label>
                          </span> </div>
                        </div>
                        <div id="picFields">
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 图文标题  &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="picTitle" type="text" name="picTitle" class="form-control" placeholder="请输入图文标题" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写图文标题" data-parsley-required="false" data-parsley-maxlength="30" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3">图文图片&nbsp;:</label>
                            <div class="col-md-9 col-sm-8">
                                <input type="hidden" id="addFormPicImage" name="picImage">
                                <div class="clickreply-image m-b-15"><img src="${imgRoot}default_image.gif" id="addFormPicImageImg" alt="" class="media-object"></div>
                                <p class="text-info">品牌LOGO尺寸要求宽度为360像素、高度为200像素；支持格式gif，jpg，png。</p>
                          <span class="btn btn-sm btn-white fileinput-button"> <i class="fa fa-upload"></i> <span>文件上传</span>
                          <input id="addFormFile" type="file" name="file" autocomplete="off" multiple>
                          </span> </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 图文描述 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <textarea id="picDesc" name="picDesc" class="form-control" placeholder="可在此处填写图文描述" rows="5" data-parsley-required="false" data-parsley-required-message="请填写图文描述"></textarea>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 图文链接地址 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="picClickUrl" type="text" name="picClickUrl" class="form-control" placeholder="请输入图文链接地址" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写图文链接地址"  data-parsley-maxlength="30" />
                            </div>
                        </div>
                        </div>
                        <div class="form-group" id="textFields">
                            <label class="control-label col-md-2 col-sm-3"> 回复内容 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <textarea id="crContent" name="content" class="form-control" placeholder="可在此处填写回复内容" rows="5" data-parsley-required="false" data-parsley-required-message="请填写回复内容"></textarea>
                            </div>
                        </div>
                    </form>
                    <!-- 结束新增品牌设置模块--> </div>
                <div class="modal-footer"> <a href="javascript:;" class="btn btn-white" data-dismiss="modal">放弃操作</a> <a href="javascript:;" class="btn btn-primary" data-loading-text="Loading..." nc-ajax-submit-target="addForm" nc-ajax-submit>确认提交</a> </div>
            </div>
        </div>
    </div>
    <!-- 结束新增点击回复素材模态窗口 -->

    <!-- 开始编辑点击回复素材模态窗口 -->
    <div class="modal fade" id="editModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title"> 编辑点击回复素材 <a class="btn btn-info btn-xs m-l-10" role="button" data-toggle="collapse" href="#OperationTipsEdit" aria-expanded="false" title="操作提示"> <i class="fa fa-exclamation"></i> &nbsp;提示 </a> </h4>
                </div>
                <div class="modal-body">
                    <!-- 开始操作提示 -->
                    <ul class="text-info p-b-15 p-l-15 collapse" role="tabpanel" id="OperationTipsEdit">
                        <li class="m-b-3">用于微信公众号自定义菜单按钮点击后的回复。</li>
                        <li class="m-b-3">图文图片按照规定尺寸宽360像素、高200像素，格式为jpg\gif\png的图片上传。</li>
                        <li class="m-b-3">图文链接地址请填写完整的带http://的URL地址。</li>
                    </ul>
                    <!-- 结束操作提示 -->
                    <!-- 开始新增品牌设置模块-->
                    <form class="form-horizontal form-bordered p-0" id="editForm" autocomplete="off" action="${adminRoot}clickreply/json/save" method="post" data-parsley-validate="true">
                        <input type="hidden" name="id" id="editCrId">
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复主题 <i class="f-s-14 text-danger">*</i> &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="editCrTitle" type="text" name="title" class="form-control" placeholder="请输入点击回复素材的主题" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击回复素材的主题" data-parsley-required="true" data-parsley-maxlength="30" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复说明 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="editCrNote" type="text" name="note" class="form-control" placeholder="请输入点击回复素材的说明" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击回复素材的说明"  data-parsley-maxlength="100" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 点击标识码 <i class="f-s-14 text-danger">*</i> &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <input id="editCrCode" type="text" name="code" class="form-control" placeholder="请输入点击标识码" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写点击标识码" data-parsley-required="true" data-parsley-maxlength="30" />
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-md-2 col-sm-3"> 回复类型 &nbsp;:</label>
                            <div class="col-md-9 col-sm-8"> <span data-tip="tooltip" data-placement="right" data-original-title="请选择点击回复事件的类型">
                          <label class="radio-inline">
                            <input id="editCrType_2" name="editType" type="radio" value="2" checked="">
                            图文</label>
                          <label class="radio-inline">
                            <input id="editCrType_1" name="editType" type="radio" value="1">
                            文字</label>
                          </span> </div>
                        </div>
                        <div id="editPicFields">
                            <div class="form-group">
                                <label class="control-label col-md-2 col-sm-3"> 图文标题  &nbsp;: </label>
                                <div class="col-md-9 col-sm-8">
                                    <input id="editPicTitle" type="text" name="picTitle" class="form-control" placeholder="请输入图文标题" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写图文标题" data-parsley-required="false" data-parsley-maxlength="30" />
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-2 col-sm-3">图文图片&nbsp;:</label>
                                <div class="col-md-9 col-sm-8">
                                    <input type="hidden" id="editFormPicImage" name="picImage">
                                    <div class="clickreply-image m-b-15"><img src="${imgRoot}default_image.gif" id="editFormPicImageImg" alt="" class="media-object"></div>
                                    <p class="text-info">品牌LOGO尺寸要求宽度为360像素、高度为200像素；支持格式gif，jpg，png。</p>
                                  <span class="btn btn-sm btn-white fileinput-button"> <i class="fa fa-upload"></i> <span>文件上传</span>
                                  <input id="editFormFile" type="file" name="file" autocomplete="off" multiple>
                                  </span>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-2 col-sm-3"> 图文描述 &nbsp;: </label>
                                <div class="col-md-9 col-sm-8">
                                    <textarea id="editPicDesc" name="picDesc" class="form-control" placeholder="可在此处填写图文描述" rows="5" data-parsley-required="false" data-parsley-required-message="请填写图文描述"></textarea>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="control-label col-md-2 col-sm-3"> 图文链接地址 &nbsp;: </label>
                                <div class="col-md-9 col-sm-8">
                                    <input id="editPicClickUrl" type="text" name="picClickUrl" class="form-control" placeholder="请输入图文链接地址" autocomplete="off" data-tip="tooltip" data-placement="auto" data-original-title="请填写图文链接地址"  data-parsley-maxlength="30" />
                                </div>
                            </div>
                        </div>
                        <div class="form-group" id="editTextFields">
                            <label class="control-label col-md-2 col-sm-3"> 回复内容 &nbsp;: </label>
                            <div class="col-md-9 col-sm-8">
                                <textarea id="editCrContent" name="content" class="form-control" placeholder="可在此处填写回复内容" rows="5" data-parsley-required="false" data-parsley-required-message="请填写回复内容"></textarea>
                            </div>
                        </div>
                    </form>
                    <!-- 结束新增品牌设置模块--> </div>
                <div class="modal-footer"> <a href="javascript:;" class="btn btn-white" data-dismiss="modal">放弃操作</a> <a href="javascript:;" class="btn btn-primary" data-loading-text="Loading..." nc-ajax-submit-target="editForm" nc-ajax-submit>确认提交</a> </div>
            </div>
        </div>
    </div>
    <!-- 结束编辑点击回复素材模态窗口 -->


    <script src="${jsRoot}wx/clickreplylist.js"></script>
</@c.html>
